<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>蚂蚁金服商家中心-中国领先的第三方支付、信用评级和金融服务平台</title>
		<link rel="icon" href="img/favicon.ico" type="image/x-icon" />
	<script type="text/javascript" src="js/jquery2.1.4.min.js" ></script>
		<script>
			$(function(){
				$(".loginDivClose").click(function(){
					$(".loginDiv").hide();
				})
				
			})
			
			
				$(function(){
				
					$(".saoma").click(function(){
						$(".saoma").animate({marginLeft:"169px" , marginTop: "-123px"},200);
						$(".zhanghao").animate({marginLeft:"226px" , marginTop: "-60px"},200);
						$(".saoma").css("display","none");
						$(".zhanghao").css("display","block");
						$(".loginDiv").css("height","295px");
						$(".spanzhanghao").css("opacity","0");
						$(".spansaoma").css("opacity","1");
						$(".loginDivMid1").css("display","block");
						$(".loginDivFooter1").css("display","block");
						$("form").css("display","none");
					});
					$(".zhanghao").click(function(){
						$(".saoma").animate({marginLeft:"229px" , marginTop: "-63px"},200);
						$(".zhanghao").animate({marginLeft:"286px" , marginTop: "0px"},200);
						$(".saoma").css("display","block");
						$(".zhanghao").css("display","none");
						$(".loginDiv").css("height","295px");
						$(".spanzhanghao").css("opacity","1");
						$(".spansaoma").css("opacity","0");
						$(".loginDivMid1").css("display","none");
						$(".loginDivFooter1").css("display","none");
						$("form").css("display","block");
					});
					$(".loginCheckTextPic").click(function(){
//						$(".loginCheckText").css("display","none");
						$(".loginCheckVoice").css("display","block");
					});
					$(".loginCheckVoicePic").click(function(){
						$(".loginCheckVoice").css("display","none");
						$(".loginCheckText").css("display","block");
					});
					$(".loginDivFooter1 .p2 .a1").mouseover(function(){
						$("#pic1").css("opacity","0");
						$("#pic2").fadeIn(200);
					});
					$(".loginDivFooter1 .p2 .a1").mouseover(function(){
						$("#pic2").animate({marginLeft:"0px"},500);	
					});
					$(".loginDivFooter1 .p2 .a1").mouseout(function(){
						$("#pic1").css("opacity","1");
						$("#pic2").fadeOut(200);	
					});
					$(".loginDivFooter1 .p2 .a1").mouseout(function(){
						$("#pic2").animate({marginLeft:"74px"},500);	
					});
					})

			$(function(){
				$("#s1").click(function(){
					$("#tab2").fadeOut(1000);
					$("#tab3").fadeOut(1000);
					$("#tab4").fadeOut(1000);
				    $("#tab1").fadeIn(1000);
				    
				   
				    
				  
					
				})
			})
			$(function(){
				$("#s2").click(function(){
					
					$("#tab2").fadeIn(1000);
					
					$("#tab3").fadeOut(1000);
					$("#tab4").fadeOut(1000);
				    $("#tab1").fadeOut(1000);
				})
			})
			$(function(){
				$("#s3").click(function(){
					$("#tab3").fadeIn(1000);
					$("#tab2").fadeOut(1000);
					$("#tab4").fadeOut(1000);
				  $("#tab1").fadeOut(1000);
				  
				})
			})
			$(function(){
				$("#s4").click(function(){
					$("#tab4").fadeIn(1000);
					$("#tab2").fadeOut(1000);
				    $("#tab3").fadeOut(1000);
					$("#tab1").fadeOut(1000);
				})
			})
			$(function(){
				$("#s1").click(function(){
					$("#s1").css("padding-left"," 20px")
					$("#s2").css("padding-left"," 0px")
				    $("#s3").css("padding-left"," 0px")
				    $("#s4").css("padding-left"," 0px")
				})})
			$(function(){
				$("#s2").click(function(){
					$("#s2").css("padding-left"," 20px")
					$("#s1").css("padding-left"," 0px")
				    $("#s3").css("padding-left"," 0px")
				    $("#s4").css("padding-left"," 0px")
				})})
			$(function(){
				$("#s3").click(function(){
					$("#s3").css("padding-left"," 20px")
					$("#s2").css("padding-left"," 0px")
				    $("#s1").css("padding-left"," 0px")
				    $("#s4").css("padding-left"," 0px")
				})})
			$(function(){
				$("#s4").click(function(){
					$("#s4").css("padding-left"," 20px")
					$("#s2").css("padding-left"," 0px")
				    $("#s3").css("padding-left"," 0px")
				    $("#s1").css("padding-left"," 0px")
				})})
			
		</script>
		<style>
			.d10{width: 100%;height: 30px;background-color: #3a3a3a;}
			.d1{width: 1200px;height: 30px;background-color: #3a3a3a;color: #9f9f9f;font-size: 12px;margin: auto;}
			.d11{line-height: 16px;float: left;color: #afafaf;padding: 5px;}
			.d12{line-height: 16px;float: right;color: #afafaf;padding: 5px;}
			.d20{width: 100%;height: 80px;}
			.d2{width: 1200px;height: 80px;margin: auto;}
			.d21{display: inline-block;float: left;height: 80px;}
			.d21 img{width: 215.844px;height: 60px;margin-top: 5px;}
			.d2 li{min-width: auto; height: 16px;padding: 30px;margin: 0;position:  relative;float: left;color: #444;text-decoration: none;text-align: center;font-size: 16px;line-height: 1;font-family: Microsoft YaHei,Helvetica Neue,Tahoma,sans-serif;font-weight: 400;-webkit-font-smoothing: antialiased;}
			.d2 ul{list-style: none;height: 80px;width: 480px; display: inline-block;clear: both;padding: 0px;margin: 0px;margin-left: 50px;}
		    .d2 a{text-decoration: none; color: #444;}
		    .d2 a:hover{color: #19ACF7;}
		    .d2 li:hover {border-bottom: #19ACF7 solid 2px;}
		    .d30 {width: 100%;height: 360px;}
		    .d30 span{padding:0px 8px;border-radius:50%;width: 5px; height: 5px; vertical-align: middle;cursor: pointer;background-color: #999999;margin-left: 20px;}
		   /* .d30 span:active{padding-left: 20px;}*/
		    .d31 { position:absolute;z-index:999;  top:400px;left:650px;bottom: 12px;margin-left: -60px;height: 100px;}
		    .d32 div{display: none;position: absolute;z-index: 100;top: 110px;}
		    .d32 img{width: 1349px;height: 360px;}     
		    .Div {display: block;}  
		    .s{width: 20px; height: 20px;}
		    .d40{width: 1200px;height: 250px;margin: auto;margin-top: 50px;}
		    .d411{display: inline-block;height: 100px;width: 100px; line-height: 100px;text-align: center;border: 3px solid transparent;margin: 0;
                  border-radius: 100%;transition: width 0.2s,height 0.2s}
		   .d411 img{height: 100%;width: 100%;}
		   .d40 h3{width: 120px;    line-height: 25px; font-size: 18px;color: #3D3D3D;padding: 12px 0 7px;margin: 0px;display: inline-block;}
		   .d412{    color: #9A9A9A;font-size: 12px;line-height: 17px;height: 34px;overflow: hidden;display: inline-block;}
		   .d40 span{display: none;   padding: 6px 20px;background-color: #05A6F3;margin: 17px auto;font-size: 14px;line-height: 25px;border-radius: 5px;color:white;}
		   .d40 a{    display: block; width: 200px;padding: 29px 16px;text-align: center;float: left;height: 240px;margin: 0 0 10px; border: 1px solid #E7E7E7; box-sizing: border-box;border-radius: 10px;overflow: hidden;margin-left: 50px;cursor: pointer;}
		   #a1:hover span{display: block;}
		   #a2:hover span{display: block;}
		   #a3:hover span{display: block;}
		   #a4:hover span{display: block;}
		   #a5:hover span{display: block;}
		  #a1:hover  div{width: 60px;height: 60px;}
		  #a2:hover  div{width: 60px;height: 60px;} 
		  #a3:hover  div{width: 60px;height: 60px;}
		  #a4:hover  div{width: 60px;height: 60px;}
		  #a5:hover  div{width: 60px;height: 60px;}
		  #a6{    font-size: 14px;line-height: 20px;margin: auto;color: #0ae;margin-top: 20px;}
		  .d40 a:hover{box-shadow:0px 0px  15px 5px #B7B7B7;}
	      .d5{width: 1200px;height: 360px;margin: auto;margin-top: 50px;}
	      .d5 img{width: 100%;height: 100%;}
	       
	      .d6{font-size: 16px;}
          .mpFooterLinks {display: block;text-align: center;line-height: 2.4;font-size: 12px;color: #B7B7B7;margin: 0px; }
          .mpFooterLinks li {display: inline-block; margin: 0px;}
 
          .mpFooterLinks li+li:before {content: '|';display: inline-block;padding: 0 12px;}
 
          .mpFooterLinks li a {display: inline-block;color: #B7B7B7; text-decoration: none;}
          .mpCopyRight{margin: auto;text-align: center;font-size: 12px;color: #B7B7B7;margin: auto;}
           .server {text-align: center; color: #eeefef;font-size: 16px;margin: auto;}
           .loginDiv{
	position: absolute;
    z-index: 650;
    top: 250px;
    right: 50px;
    width: 286px;
    height: 295px;
    margin-left: -143px;
    margin-top: -116px;
    background-color: #000000;
    opacity: 0.7;
    border-radius: 5px 5px 0px 0px;
    overflow: hidden;
   
}
     
  .loginDiv a{text-decoration: none;}   
   
   
.loginDiv{
	position: absolute;
    z-index: 650;
    top: 250px;
    right: 50px;
    width: 286px;
    height: 295px;
    margin-left: -143px;
    margin-top: -116px;
    background-color: #000000;
    opacity: 0.7;
    border-radius: 5px 5px 0px 0px;
    overflow: hidden;
   
}

.loginDivTop{
	width: 286px;
	height: 60px;
}

.loginDivClose{
	position: relative;
	z-index: 660;
	font-size: 5px;
	font-weight: 600;
	color: white;
	left: 9px;
	top: -15px;
	cursor: pointer;
}

.loginDiv .span1{
	position: relative;
	z-index: 660;
	width: 100%;
	height: 28px;
	line-height: 60px;
	font-size: 18px;
	font-family: "微软雅黑";
    color: #FFF;
    text-align: center;
    left: 87px;
	top: 11px;
}


.zhanghao{
	position: absolute;
	z-index: 680;
	width: 60px;
	height: 60px;
	background-image: url(img/扫码啥的.png);
	background-position: 100% 58%;
	margin-left: 226px;
	margin-top: -60px;
}

.saoma{
	position: absolute;
	z-index: 680;
	width: 60px;
	height: 60px;
	background-image: url(img/扫码啥的.png);
	background-position: 78% 44%;
	margin-left: 169px;
	margin-top: -123px;
	display: none;
}

.loginDivMid1{
	position: relative;
	z-index: 660;
	width: 136px;
	height: 154px;
	margin:0 auto;
	overflow: hidden;
}

.loginDivMid1 #pic1{
	position: relative;
	z-index: 670;
	width: 136px;
	height: 136px;
	background-image: url(img/二维码.png);
	background-size: 135px 135px;
	background: cover;
	top: 15px;
}

.loginDivMid1 #pic2{
	position: relative;
	z-index: 680;
	/*width: 320px;
	height: 508px;*/
	width: 136px;
	height: 136px;
	background-image: url(img/扫码啥的.png);
	background-position: 4% 87%;
	margin-left: 75px;
	top: -140px;
	display: none;
}

.loginDivFooter1{
	widows: 284px;
	baseline-shift: 56px;
	text-align: center;
	margin-left: -2px;
    margin-top: 7px;
}

.loginDivFooter1 .p1{
	font-size: 14px;
    /*line-height: 24px;*/
    color: #FFF;
    text-align: center;
    margin-bottom: 13px;
}

.loginDivFooter1 span{
	font-size: 8px;
    line-height: 28px;
    color: #FFF;
    text-align: center;
}

.loginDivFooter1 .p2 a{
	font-size: 8px;
    line-height: 28px;
    color: #FFF;
    text-align: center;
    margin-left: 6px;
    margin-right: 5px;
}

.loginDivFooter1 .p2 a:hover{
	text-decoration: underline;
}

form{
	position: absolute;
	z-index: 700;
	top: 61px;
	left: 34px;
	width: 220px;
	height: 200px;
	display: none;
	/*opacity: 0;*/
}

.spanzhanghao{
	position: absolute;
	margin-left: -88px;
	opacity: 0;
}

.loginUsername{
	width: 220px;
	height: 40px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.loginUsernamePic{
	width: 40px;
	height: 40px;
	float: left;
	background-image: url(img/loginusernam.png);
	background-size: 40px 40px;
}

#loginUsername{
	width: 160px;
	height: 20px;
	padding: 10px;
	border: 1px;
	float: left;
}

.loginPassword{
	width: 220px;
	height: 40px;
	margin-bottom: 5px;
}

.loginPasswordPic{
	width: 40px;
	height: 40px;
	float: left;
	background-image: url(img/loginpassword.png);
	background-size: 40px 40px;
}

#loginPassword{
	width: 160px;
	height: 20px;
	padding: 10px;
	border: 1px;
	float: left;
}

.loginDivMid2 span{
	position: relative;
    left: 62%;
}

.loginDivMid2 span a{
	font-size: 12px;
    color: white;
}

.loginCheckText{
	width: 220px;
	height: 40px;
	margin-top: 18px;
	margin-bottom: 5px;
}

.loginCheckTextPic{
	width: 40px;
	height: 40px;
	float: left;
	background-image: url(img/logintext.png);
	background-size: 40px 40px;
}

#loginCheckText{
	width: 70px;
	height: 20px;
	padding: 10px;
	border: 1px;
	float: left;
}

.checkCode img{
	float: left;
	width: 80px;
	height: 40px;
	padding: 0px 0px 0px 10px ;
	cursor: pointer;
}

.loginCheckVoice{
	position: absolute;
	width: 220px;
	height: 40px;
	top: 144px;
	display: none;
}

.loginCheckVoicePic{
	width: 40px;
	height: 40px;
	float: left;
	background-image: url(img/loginvoice.png);
}

#loginCheckVoice{
	width: 70px;
	height: 20px;
	padding: 10px;
	border: 1px;
	float: left;
}

.checkVoice{
	float: left;
	background-color: white;
	width: 80px;
	height: 40px;
	margin: 0px 0px 0px 10px;
	cursor: pointer;
}

.checkVoice span{
	
	line-height: 40px;
	text-align: center;
	margin-left: -33px;
	color: #00BBEE;
	font-size: 12px;
}

#submit{
	width: 220px;
	height: 40px;
	border: 0px;
	border-radius: 5px;
	background-color: #00BBEE;
	color: #FFFFFF;
	font-size: 18px;
	letter-spacing: 5px;
	line-height: 42px;
	margin-top: 5px;
	margin-bottom: 6px;
}

.loginDivFooter2 .a2{
	font-size: 12px;
	color: white;
}

.loginDivFooter2 .a3{
	font-size: 12px;
	color: #00BBEE;
	float: right;
	margin-top: 4px;
}

.loginDivFooter2 a:hover{
	text-decoration: underline;
}


 </style>
	</head>
	<body style="margin: 0px;">
				 
   <div class="loginDiv"
   	
   	>
							<div class="loginDivTop">
								<span class="loginDivClose">×</span>
								<span class="span1 spansaoma">扫码登录</span>
								<span class="span1 spanzhanghao">登录支付宝</span>
								<div class="saoma">
									
								</div>
								<div class="zhanghao">
									
								</div>
							</div>
							<div class="loginDivMid1">
								<div id="pic1">
									
								</div>
								<div id="pic2">
									
								</div>
							</div>
							<div class="loginDivFooter1">
								<p class="p1">请使用手机支付宝扫码</p>
								<p class="p2">
									<a class="a1" href="https://cshall.alipay.com/lab/help_detail.htm?help_id=23427066" title="使用帮助">使用帮助</a>
									<span>|</span>
									<a href="https://mobile.alipay.com/index.htm" title="下载手机支付宝">下载手机支付宝</a>
								</p>
							</div>
							
							<form action="" method="get">
								<div class="loginDivMid2">
									<div class="loginUsername">
										<div class="loginUsernamePic">
											
										</div>
										<input type="text" id="loginUsername" placeholder="邮箱/手机号/淘宝会员名" />
									</div>
									<div class="loginPassword">
										<div class="loginPasswordPic">
											
										</div>
										<input type="password" id="loginPassword" name="" />
									</div>
									<span>
										<a href="https://accounts.alipay.com/console/querypwd/logonIdInputReset.htm?site=1&page_type=fullpage&scene_code=resetQueryPwd">
											忘记登录密码？
										</a>
									</span>
									
									<div class="loginCheckVoice">
										<div class="loginCheckVoicePic">
											
										</div>
										<input type="text" id="loginCheckVoice" placeholder="验证码" />
										<div class="checkVoice"
											data-src="https://authgtj.alipay.com:443/login/audiocode.htm?sessionID=973dcdf61d98ef88dfc804132b520031&amp;r=0.10026831323244456">
                								<span class="sl-refresh" id="J-checkcode-voice-txt">重新播放</span>
										</div>
									</div>
								</div>
								<div class="loginDivFooter2">
									<input type="submit" id="submit" value="登录"/>
									<p>
										<a class="a2" href="#" title="淘宝会员登录">淘宝会员登录</a>
										<a class="a2" href="#" title="账户激活">账户激活</a>
										<a class="a3" href="#" title="免费注册">免费注册</a>
									</p>
								</div>
								
							</form>
							
						</div>
		<div class="d10">
		<div class="d1">
			<div class="d11">
				<span>个人</span>
				<span>商家</span>
			</div>
			<div class="d12">
				<span>登录 </span>
				<span>注册 </span>
				<span>接入指引</span>
				<span>开放平台 </span>
				<span>帮之中心 </span>
			</div>
		</div>
		</div>
		<div class="d20">
			<div class="d2">
			<div class="d21"><img src="img/d21.png"></div>
			<ul>
				<li><a href="sjzx.html">首页</a></li>
				<li><a href="#">接入指引</a></li>
				<li>产品大全</li>
				<li>解决方案</li>
			</ul>
			
		</div>
		</div>
		<div class="d30">
			<div class="d31">
			<span id="s1" ></span>
			<span id="s2"></span>
			<span id="s3"></span>
			<span id="s4"></span>
			</div>
		    <div class="d32">	
			<div id="tab1" style="display: block;"><a href="#"><img src="img/d31.jpeg"></a></div>
			<div id="tab2" ><a href="#"><img src="img/d32.jpeg"></a></div>
			<div id="tab3"><a href="#"><img src="img/d33.jpeg"></a></div>
			<div id="tab4"><a href="#"><img src="img/d34.jpeg"></a></div>
		    </div>
			
		</div>
		<div class="d40">
	<a id="a1" style="margin-left: 0px;">
		<div class="d411">
			<img src=" img/d41.png">
		</div>

		<h3>电脑网站支付</h3>
		<li class="d412">用户在商家网站上完成付款</li>

		<span>我要接入</span>

	</a>
	<a id="a2">

		<div class="d411">
			<img src=" img/d42.png">
		</div>

		<h3>手机网站支付</h3>
		<li class="d412">用户在商家网站上完成付款</li>

		<span>我要接入</span>

	</a>
	<a id="a3">

		<div class="d411">
			<img src=" img/d43.png">
		</div>

		<h3>app支付</h3>
		<li class="d412">用户在商家网站上完成付款</li>

		<span>我要接入</span>

	</a>
	<a id="a4">

		<div class="d411">
			<img src=" img/d44.png">
		</div>

		<h3>当面付</h3>
		<li class="d412">用户在商家网站上完成付款</li>

		<span>我要接入</span>

	</a>
	<a id="a5">

		<div class="d411">
			<img src=" img/d44.png">
		</div>

		<h3>收钱码</h3>
		<li class="d412">用户在商家网站上完成付款</li>

		<span>我要接入</span>
    </a>
        <center><p id="a6"> 更多产品>></p></center>
		</div>
		<div class="d5">
			<img src="img/d51.png" />
		</div>
		<hr style=" height:2px;border-top:2px #185598;margin: 30px;">
		
		<div class="d6" >
  <ul class="mpFooterLinks">
    <li><a href="https://www.antgroup.com/introduction.htm" target="_blank" seed="mpFooterLinks-linkT14" smartracker="on">关于蚂蚁</a></li>
    <li><a href="https://www.antgroup.com" target="_blank" seed="mpFooterLinks-linkT15" smartracker="on">蚂蚁金服</a></li>
    <li><a href="https://www.alipay.com" target="_blank" seed="mpFooterLinks-linkT16" smartracker="on">支付宝</a></li>
    <li><a href="https://www.koubei.com" target="_blank" seed="mpFooterLinks-linkT17" smartracker="on">口碑</a></li>
    <li><a href="https://www.zmxy.com.cn" target="_blank" seed="mpFooterLinks-linkT18" smartracker="on">芝麻信用</a></li>
  </ul>
  <ul class="mpFooterLinks">
    <li><a href="http://www.alibabagroup.com/cn/global/home" target="_blank" seed="mpFooterLinks-linkT19" smartracker="on">阿里巴巴集团</a></li>
    <li><a href="https://www.alibaba.com" target="_blank" seed="mpFooterLinks-linkT20" smartracker="on">阿里巴巴国际站</a></li>
    <li><a href="https://www.1688.com/" target="_blank" seed="mpFooterLinks-linkT21" smartracker="on">1688</a></li>
    <li><a href="https://www.taobao.com/" target="_blank" seed="mpFooterLinks-linkT22" smartracker="on">淘宝</a></li>
    <li><a href="https://www.tmall.com/" target="_blank" seed="mpFooterLinks-linkT23" smartracker="on">天猫</a></li>
    <li><a href="https://ju.taobao.com/" target="_blank" seed="mpFooterLinks-linkT24" smartracker="on">聚划算</a></li>
    <li><a href="http://www.alimama.com/" target="_blank" seed="mpFooterLinks-linkT25" smartracker="on">阿里妈妈</a></li>
    <li><a href="https://www.aliyun.com/" target="_blank" seed="mpFooterLinks-linkT26" smartracker="on">阿里云计算</a></li>
  </ul>
  <div class="mpCopyRight">Copyright © 2017 蚂蚁金融服务集团 | ICP证: 沪ICP备15027489号-2</div>
  <div class="server">morderprod-49-5006</div>

</div>
		
		
	</body>
</html>
